<template>
  <view id="project">
		<!-- 项目配置 -->
		<view class="nav-box">
			<view class="nav-box-text">
				<image src="@/static/img/home/person.png" class="person"></image>
				<view class="welcome">
					<view><text>姓名：{{ userInfo.nickName }}</text></view>
					<view><text>单位：{{ userInfo.dept.deptName }}</text></view>
				</view>
			</view>
		</view>
		
		<view class="infoList">
			<view class="title">
				<text>工程公共信息</text>
			</view>
			<!-- regions.find((item)=>{return item.dictValue==form.region}).dictLabel -->
			<uni-list>
				<uni-list-item title="工程名称" :rightText="form.name" />
				<uni-list-item title="工程地址" :rightText="form.address" />
				<uni-list-item title="工程面积" :rightText="`${form.area} 平方米`" />
				<uni-list-item title="工程编码" :rightText="form.code" />
				<uni-list-item title="施工许可证号" :rightText="form.license" />
				<uni-list-item title="检测工程代码" :rightText="form.number" />
				<uni-list-item title="所在区域" :rightText="regions.length>0&&form.region?regions.find((item)=>{return item.dictValue==form.region})?regions.find((item)=>{return item.dictValue==form.region}).dictLabel:'':''" />
				<uni-list-item title="设计单位" :rightText="form.designUnitName" />
				<!-- <uni-list-item title="位置" :rightText="form.longitude?form.longitude+','+form.latitude:'请选择'" link clickable @click="getLocaltion()" /> -->
			</uni-list>
			<view class="title">
				<text>坐标点</text>
				<uni-icons v-if="form.isLine == 1?true:false" type="plus" size="20" class="add-plus" @click="addLocaltion()"></uni-icons>
			</view>
			<uni-swipe-action v-if="form.locationVOList">
				<uni-swipe-action-item 
					v-for="(item, index) in form.locationVOList" 
					:key="item.id" 
					:right-options="[{text: '删除',style:{backgroundColor:'#ff3a31'}}]" 
					@click="locationVOListclick($event, item, index)"
					:disabled="form.locationVOList.length == 1"
				>
					<uni-list>
						<uni-list-item :title="item.longitude?item.longitude+' , '+item.latitude:'请选择'" link clickable @click="getLocaltion(index,item)" />
					</uni-list>
				</uni-swipe-action-item>
			</uni-swipe-action>
			<uni-list v-else>
				<uni-list-item :title="form.longitude?form.longitude+' , '+form.latitude:'请选择'" link clickable @click="getLocaltion()" />
			</uni-list>
			<view class="title">
				<text>建设单位</text>
			</view>
			<uni-list>
				<uni-list-item :title="form.build.length>0?form.build[0].deptName:''" />
			</uni-list>
			<view class="title">
				<text>施工单位</text>
				<!-- <uni-icons v-if="jsdw" type="plus" size="20" class="add-plus" @click="checkCompany(3)"></uni-icons> -->
			</view>
			<uni-list 
				v-for="(item, index) in form.construct" 
				:key="item.id" >
				<uni-list-item :title="item.deptName" />
			</uni-list>
			<!-- <uni-swipe-action>
				<uni-swipe-action-item 
					v-for="(item, index) in form.construct" 
					:key="item.id" 
					:right-options="[{text: '删除',style:{backgroundColor:'#ff3a31'}}]" 
					@click="swipeClick($event, item, index)"
				>
					<view class="content-box">
						<text class="content-text">{{ item.deptName }}</text>
					</view>
				</uni-swipe-action-item>
			</uni-swipe-action> -->
			<view class="title">
				<text>监理单位</text>
				<!-- <uni-icons v-if="jsdw" type="plus" size="20" class="add-plus" @click="checkCompany(4)"></uni-icons> -->
			</view>
			<uni-list
				v-for="(item, index) in form.supervise" 
				:key="item.id" >
				<uni-list-item :title="item.deptName" />
			</uni-list>
			<!-- <uni-swipe-action>
				<uni-swipe-action-item 
					v-for="(item, index) in form.supervise" 
					:key="item.id" 
					:right-options="[{text: '删除',style:{backgroundColor:'#ff3a31'}}]" 
					@click="swipeClick($event, item, index)"
				>
					<view class="content-box">
						<text class="content-text">{{ item.deptName }}</text>
					</view>
				</uni-swipe-action-item>
			</uni-swipe-action> -->
			<view class="title">
				<text>检测机构</text>
				<!-- <uni-icons v-if="jsdw" type="plus" size="20" class="add-plus" @click="checkCompany(5)"></uni-icons> -->
			</view>
			<uni-list
				v-for="(item, index) in form.check" 
				:key="item.id" >
				<uni-list-item :title="item.deptName" />
			</uni-list>
			<!-- <uni-swipe-action>
				<uni-swipe-action-item 
					v-for="(item, index) in form.check" 
					:key="item.id" 
					:right-options="[{text: '删除',style:{backgroundColor:'#ff3a31'}}]" 
					@click="swipeClick($event, item, index)"
				>
					<view class="content-box">
						<text class="content-text">{{ item.deptName }}</text>
					</view>
				</uni-swipe-action-item>
			</uni-swipe-action> -->
		</view>
		
		<uni-popup ref="companyPopup" background-color="#fff">
			<view class="popup-content">
				<uni-forms :modelValue="searchForm" :label-width="80" border style="padding: 0 10px;">
					<uni-forms-item label="公司名称" name="name">
						<uni-easyinput 
							v-model="searchForm.name" 
							:inputBorder="false" 
							type="text" 
							suffixIcon="search" 
							placeholder="请输入公司名称"
							@iconClick="getData()" 
							@confirm="getData()"
						/>
					</uni-forms-item>
				</uni-forms>
				<uni-table style="height: 250px;" ref="table" border stripe type="selection" @selection-change="selectionChange">
					<uni-tr>
						<uni-th width="150" align="center">公司名称</uni-th>
					</uni-tr>
					<uni-tr v-for="(item, index) in tableData" :key="index">
						<uni-td>{{ item.deptName }}</uni-td>
					</uni-tr>
				</uni-table>
				<view style="margin-top: 10px;">
					<uni-pagination 
						show-icon 
						:page-size="searchForm.pageSize" 
						:current="searchForm.pageNum" 
						:total="searchForm.total" 
						@change="pageChange" 
					/>
				</view>
				<button type="primary" class="btn" @click="comfirm" style="margin: 8px;">确定</button>
			</view>
		</uni-popup>
  </view>
</template>

<script>
import { getProject, savePosition, addCompany, removeCompany, companylist, getDict, getProjectRole ,ProjectList } from '@/api/project/index'
import { decrypt } from '@/common/jsencrpty.js';

export default {
  data() {
    return {
			userInfo: {},
			tableData: [],
			searchForm: {
				name: '',
				pageNum: 1,
				pageSize: 5,
				total: 0,
				ignoreProjectId: '',
				type: ''
			},
			regions: [],
			selectIndex: [],
			jsdw:null,
      form: {
      	name: '',					// 工程名称
				address: '',			// 工程地址
				area: '',					// 工程面积
				code: '',					// 工程编码
				license: '',			// 施工许可证
				number: '',				// 检测工程代码
				region: '',				// 所在区域
				longitude: '',		// 经度
				latitude: '',			// 纬度
				design: [],				// 设计单位
				build: [],				// 建设单位
				construct: [],		// 施工单位
				supervise: [],		// 监理单位
				check: []					// 检测机构
      }
    }
  },
  onLoad() {
		this.userInfo = uni.getStorageSync('userInfo');
		this.userInfo.nickName = decrypt(this.userInfo.nickName)
		// this.getInfo()
		this.getProjectList()
		getDict('sys_region_code').then(res=>{
			this.regions = res.data
		})
		let project = uni.getStorageSync('projectInfo')
		// getProjectRole(project.id).then(res=>{
		// 	this.jsdw = res.data.jsdw
		// })
  },
  methods: {
		// 编辑位置
		getLocaltion(index,item) {
			uni.chooseLocation({
				latitude:item !=undefined?item.latitude:this.form.latitude,
				longitude:item !=undefined?item.longitude:this.form.longitude,
				success: res => {
					this.setSavePosition(index,item,res)
				}
			});
		},
		// 新增位置
		addLocaltion(index,item){
			uni.chooseLocation({
				success: res => {
					this.setSavePosition(index,item,res)
				}
			});
		},
		// 定位
		setSavePosition(index,item,res){
			let obj = {
				id:this.searchForm.ignoreProjectId,
				locationVOList:[]
			}
			if(index !=undefined){
				console.log(2222)
				this.form.locationVOList.forEach((_item,_index)=>{
					if(_index == index){
						obj.locationVOList.push({
							// id:item.id,
							longitude:Number(res.longitude),
							latitude:Number(res.latitude),
							// sourceId:item.sourceId
						})
					}else{
						obj.locationVOList.push({
							id:_item.id,
							longitude:_item.longitude,
							latitude:_item.latitude,
							sourceId:_item.sourceId
						})
					}
				})
			}else{
				if(this.form.isLine == 1){
					if(this.form.locationVOList){
						console.log(1111)
						this.form.locationVOList.forEach(_item=>{
							obj.locationVOList.push({
								id:_item.id,
								longitude:_item.longitude,
								latitude:_item.latitude,
								sourceId:_item.sourceId
							})
						})
						obj.locationVOList.push({longitude:Number(res.longitude),latitude:Number(res.latitude)})
					}else{
						obj.locationVOList.push({longitude:Number(res.longitude),latitude:Number(res.latitude)})
						obj.locationVOList.push({longitude:Number(this.form.longitude),latitude:Number(this.form.latitude)})
					}
				}else{
					console.log(123)
					obj.locationVOList = [{longitude:res.longitude,latitude:res.latitude}]
				}
			}
			console.log(obj,'this.form.locationVOList',111111)
			savePosition(obj).then(res=>{
				if (res.code == 200) {
					this.getProjectList()
					uni.showToast({
						title: '位置更新成功',
					})
				}
			})
		},
		// 复选框选中
		selectionChange(e) {
			this.selectIndex = e.detail.index
		},
		// 分页触发
		pageChange(e) {
			this.searchForm.pageNum = e.current
			this.$refs.table.clearSelection()
			this.getData()
		},
		// 确认选择单位
		comfirm() {
			if (this.selectIndex.length == 0) {
				uni.showToast({
					title: '请选择单位',
					icon: 'none'
				})
				return false
			}
			let list = []
			this.selectIndex.forEach(item=>{
				list.push(this.tableData[item])
			})
			let params = {
				ids: list.map(item=>{return item.companyId}),
				projectId: this.searchForm.ignoreProjectId,
				objectString: this.searchForm.type==3?'construct':this.searchForm.type==4?'supervise':'check'
			}
			addCompany(params).then(res=>{
				if (res.code == 200) {
					if (this.searchForm.type == 3) {
						this.form.construct = this.form.construct.concat(list)
					} else if (this.searchForm.type == 4) {
						this.form.supervise = this.form.supervise.concat(list)
					} else {
						this.form.check = this.form.check.concat(list)
					}
					this.$refs.companyPopup.close()
				}
			})
		},
		// 移除单位
		swipeClick($event, item, index) {
			let params = {
				ids: [item.id],
				projectId: this.searchForm.ignoreProjectId,
				objectString: item.type
			}
			removeCompany(params).then(res=>{
				if (res.code == 200) {
					if (item.type == 'construct') {
						this.form.construct.splice(index, 1)
					} else if (item.type == 'supervise') {
						this.form.supervise.splice(index, 1)
					} else {
						this.form.check.splice(index, 1)
					}
				}
			})
		},
		// 移除点位
		locationVOListclick($event, item, index){
			console.log($event, item, index,'$event, item, index')
			// splice
			this.form.locationVOList.splice(index,1)
			let obj = {
				id:this.searchForm.ignoreProjectId,
				locationVOList:[]
			}
			this.form.locationVOList.forEach(item=>{
				obj.locationVOList.push({
					id:item.id,
					longitude:item.longitude,
					latitude:item.latitude,
					sourceId:item.sourceId
				})
			})
			console.log(obj,'obj')
			savePosition(obj).then(res=>{
				if (res.code == 200) {
					this.getProjectList()
					uni.showToast({
						title: '位置更新成功',
					})
				}
			})
		},
		// 获取项目详情信息
		getInfo() {
			let project = uni.getStorageSync('projectInfo')
			this.searchForm.ignoreProjectId = project.id
			getProject(project.id).then(res=>{
				this.form = res.data
			})
			
		},
		// 获取项目详情信息
		getProjectList(){
			let project = uni.getStorageSync('projectInfo')
			this.searchForm.ignoreProjectId = project.id
			console.log({id:project.id})
			ProjectList({id:project.id}).then(res=>{
				console.log(res.rows[0])
				this.form = res.rows[0]
			})
		},
		// 打开单位选择弹窗
		checkCompany(type) {
			this.searchForm.pageNum = 1
			this.searchForm.type = type
			this.getData()
			this.$refs.companyPopup.open('center')
		},
		// 查询单位信息
		getData() {
			companylist(this.searchForm).then(res=>{
				this.tableData = res.rows
				this.searchForm.total = res.total
			})
		},
		// 保存
    save() {
			
		}
  }
}
</script>
<style lang="scss" scoped>
	#project {
		min-height: calc(100vh - 44px);
		background-color: #fafafa;
		
		.nav-box {
			width: 100vw;
			height: 160px;
			margin-top: -44px;
			padding: 56px 20px 56px 20px;
			background-image: url('../../static/img/home/head-bg.png');
		
			.nav-box-text {
				height: 50px;
				display: flex;
				align-items: center;
		
				.person {
					width: 48px;
					height: 48px;
				}
				.welcome {
					color: #333;
					font-size: 32rpx;
					margin-left: 40rpx;
				}
			}
		}
		
		.infoList {
			margin-top: -46px;
			padding-bottom: 20px;
			
			.title {
				display: flex;
				font-size: 14px;
				padding: 10px 20px;
				position: relative;
				align-items: center;
				
				&::before {
					top: 12px;
					left: 10px;
					content: '';
					width: 4px;
					height: 16px;
					position: absolute;
					border-radius: 10px;
					background-color: #2979ff;
				}
				.add-plus {
					margin-left: 5px;
					color: #2979ff !important;
				}
			}
			
			.content-box {
				height: 44px;
				display: flex;
				padding: 0 15px;
				line-height: 44px;
				position: relative;
				background-color: #fff;
				border-bottom-width: 1px;
				border-bottom-style: solid;
				border-bottom-color: #f5f5f5;
				
				.content-text {
					font-size: 14px;
				}
			}
			
			/deep/ .uni-list-item__content {
				flex: 0 0 auto;
			}
			/deep/ .uni-list-item__extra {
				flex: 1 1 auto;
			}
		}
		
		.popup-content {
			width: 80vw;
			height: 396px;
			
			/deep/ .uni-table {
				min-width: auto !important;
			}
			/deep/ .checkbox {
				padding: 0 !important;
			}
		}
	}
</style>
